<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
	<head>
		<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
		<title>Untitled Document</title>
		<script type="text/javascript">var CTP_WEB_FULLPATH = "../../"</script>
        <script type="text/javascript" src="../../js/jquery/jquery.js">
        </script>
        <script type="text/javascript" src="../../js/jquery/jquery-migrate.js">
        </script>
        <script type="text/javascript" src="../../js/jqueryui/jquery-ui.js">
        </script>
        <script type="text/javascript" src="../../js/ctp/public/jsextend.js">
        </script>
        <script type="text/javascript" src="../../js/ctp/public/ctp.core.js">
        </script>
		<script type="text/javascript" src="../../js/ctp/public/ctp.base.js">
        </script>
		<script type="text/javascript" src="../../js/ctp/public/ctp.ui.component.js">
        </script>
        <script type="text/javascript" src="../../js/ctp/panel/ctp.ui.panel.js">
        </script>
        <script type="text/javascript" src="../../js/ctp/button/ctp.ui.button.js">
        </script>
		<script type="text/javascript" src="../../js/ctp/groupbox/ctp.ui.groupbox.js">
		</script>
		<script type="text/javascript" src="../../js/ctp/gridlayout/ctp.ui.gridlayout.js">
        </script>	
        <script type="text/javascript" src="../../js/ctp/zoomimageup/ctp.ui.zoomimageup.js">
        </script>
        <script type="text/javascript" src="../../js/ctp/borderlayout/ctp.ui.borderlayout-resize.js">
        </script>
        <script type="text/javascript" src="../../js/ctp/borderlayout/ctp.ui.borderlayout-noresize.js">
        </script>
        <script type="text/javascript" src="../../js/ctp/borderlayout/ctp.ui.borderlayout.js">
        </script>	
        <script type='text/javascript' src='../../js/ctp/borderlayout/jquery.layout.js'></script>
        <script type="text/javascript" src="../../js/ctp/tooltip/ctp.ui.tooltip.js">
        </script>
        
		<script type="text/javascript" src="../../js/ctp/messagebox/ctp.ui.messagebox.js"></script>
        <link href="../../css/skins/standard/ctp-common.css" rel="stylesheet" type="text/css"/>
        <link href="../../css/panel.css" rel="stylesheet" type="text/css"/>
        <link href="../../css/button.css" rel="stylesheet" type="text/css"/>
		<link href="../../css/groupbox.css" rel="stylesheet" type="text/css"/>
		<link href="../../css/gridlayout.css" rel="stylesheet" type="text/css"/>
		<link href="../../css/messagebox.css" rel="stylesheet" type="text/css"/>
		<link href="../../css/tooltip.css" rel="stylesheet" type="text/css"/>
		<link href='../../css/borderlayout.css' rel='stylesheet' type='text/css'/>
		<link href='../../css/zoomimageup.css' rel='stylesheet' type='text/css'/>
		<link href='../../css/tooltip.css' rel='stylesheet' type='text/css'/>
		
		<script type="text/javascript">
			var zoomimageup;
			var button1;
			$(document).ready(	
				function(){
					button1 = new ctp.ui.button({
						id:'button',
						text:'测试',
						onClick:testZoomimageup,
						renderTo:'body'
					});
				     var panel1 = new ctp.ui.panel({
	                    title: 'zoomimageup实例',
	                    collapsible: true,
	                    width: '800px',
	                    height: '500px',
						align:'center',
	                    renderTo: 'body'
	                });     
	                var borderlayout1=new ctp.ui.borderlayout({
						type: "2U",
						west__size:0.6
					});
					borderlayout1.create(panel1);
					var zoomimageup = new ctp.ui.zoomimageup({
						id:'zoomimageup1',
						extFilter:'jpg | bmp/i',
						imgRenderTo:borderlayout1.panes.west,
						fileupRenderTo:borderlayout1.panes.center,
						zoomRenderTo:borderlayout1.panes.center,
						renderTo:'body',
						zoomSrc:'../../images/blue/datepicker/ui-icon-datepicker.jpg',
						imgSrc:'../../images/blue/datepicker/ui-icon-datepicker.jpg',
						fileupScanText:'选择',
						fileupUpText:'预览',
						fileupTitle:'更换头像',	
						fileupTitleScribe:'请选择新的图片文件,文件需小于5M',	
						fileupErrMsgTitle:'错误提示',	
						fileupErrMsgExt:'您所选择的文件格式不正确,请选择JPG或BMP文件',
						fileupErrMsgNone:'请选择需要上传的文件',
						imgTitle:'裁剪头像',
						imgTitleScribe:'拖动需要裁减的照片,已裁剪出满意的形象照,你所裁剪的头像将显示在左边',
						imgErrMsgCutNone:'上传图像之后再保存图像',
						imgSaveText:'上传',
						zoomTitle:'当前头像',
						zoomTitleScribe:'这里显示你当前的形象照',
						fileupScanTitle:'选择你所需要上传的图片',
						fileupUpTitle:'点击此按钮，预览图片',
						imgSaveTitle:'裁剪完毕，上传图片'
					});
					function testZoomimageup(){
						var test = [];
						test.push('ctpPackage: '+zoomimageup.ctpPackage+'\n');
						test.push('getTemplate: '+zoomimageup.getTemplate({})+'\n');
						test.push('initEvent: '+zoomimageup.initEvent()+'\n');
						test.push('initSettings: '+zoomimageup.initSettings+'\n');
						test.push('isContainer: '+zoomimageup.isContainer+'\n');
						test.push('isHidden: '+zoomimageup.isHidden+'\n');
						test.push('isNeedRender: '+zoomimageup.isNeedRender+'\n');
						test.push('isNeedReset: '+zoomimageup.isNeedReset+'\n');
						test.push('jqDom: '+zoomimageup.jqDom+'\n');
						test.push('resize: '+zoomimageup.resize()+'\n');
						test.push('settings: '+zoomimageup.settings+'\n');
						test.push('type: '+zoomimageup.type+'\n');
						test.push('version: '+zoomimageup.version+'\n');
						//test.push('rendered: '+zoomimageup.rendered+'\n');
						//test.push('renderTo: '+zoomimageup.renderTo()+'\n');
						//test.push('render: '+zoomimageup.render()+'\n');
						//test.push('remove: '+zoomimageup.remove()+'\n');
						alert(test.join(''));

						test = [];
						//test.push('afterInit: '+zoomimageup.afterInit()+'\n');
						//test.push('destroy: '+zoomimageup.destroy()+'\n');
						test.push('getCtpWebType: '+zoomimageup.getCtpWebType()+'\n');
						test.push('getDefaultSettings: '+zoomimageup.getDefaultSettings()+'\n');
						test.push('getDomId: '+zoomimageup.getDomId()+'\n');
						test.push('getFnContext: '+zoomimageup.getFnContext()+'\n');
						test.push('getHeight: '+zoomimageup.getHeight()+'\n');
						test.push('getId: '+zoomimageup.getId()+'\n');
						test.push('getInitSettings: '+zoomimageup.getInitSettings()+'\n');
						test.push('getJqDom: '+zoomimageup.getJqDom()+'\n');
						test.push('getName: '+zoomimageup.getName()+'\n');
						test.push('getPkgContext: '+zoomimageup.getPkgContext()+'\n');
						test.push('getSettings: '+zoomimageup.getSettings()+'\n');
						test.push('getWidth: '+zoomimageup.getWidth()+'\n');
						test.push('hide: '+zoomimageup.hide(false,true,true)+'\n');
						alert('hide')
						//test.push('init: '+zoomimageup.init()+'\n');
						test.push('removeJqDoms: '+zoomimageup.removeJqDoms()+'\n');
						test.push('setWidth: '+zoomimageup.setWidth('400px')+ ' ' + (zoomimageup.getWidth()==400) +'\n');
						test.push('setHeight: '+zoomimageup.setHeight('50px')+ ' ' + (zoomimageup.getHeight()==50) + '\n');
						test.push('setSize: '+zoomimageup.setSize('400px','100px')+ ' ' + (zoomimageup.getHeight()==100 && zoomimageup.getWidth()==400) + '\n');
						test.push('show: '+zoomimageup.show(false,true,true)+'\n');
						alert('show')
						alert(test.join(''));

						test = [];
						test.push('getZoomTemplate: '+zoomimageup.getZoomTemplate({})+'\n');
						test.push('getFileupTemplate: '+zoomimageup.getFileupTemplate({})+'\n');
						test.push('getImageCutTemplate: '+zoomimageup.getImageCutTemplate({})+'\n');
						test.push('saveImg: '+zoomimageup.saveImg()+'\n');
						test.push('getPhotoValue: '+zoomimageup.getPhotoValue(true)+'\n');
						test.push('zoomimageUpload: '+zoomimageup.zoomimageUpload(true)+'\n');
						test.push('remove: '+zoomimageup.remove(true)+'\n');
						alert(test.join(''));	
					}
				});
		</script>
	</head>
	<body>
		
	</body>
</html>